<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="/shared/bootstrap/bootstrap.css" />
    <script src="/shared/bootstrap/bootstrap.bundle.js"></script>
    <link rel="stylesheet" href="index.css" />
    <link href="/shared/wangedit/style.css" rel="stylesheet" />
    <script src="/shared/wangedit/index.js"></script>
    <style>
      #editor—wrapper {
        border: 1px solid #ced4da;
        border-radius: 0.25rem;
        z-index: 100;
        /* 按需定义 */
      }

      #toolbar-container {
        border-bottom: 1px solid #ced4da;
      }

      #editor-container {
        height: 500px;
      }
    </style>
  </head>

  <body>
    <div class="main">
      <div class="topbar"></div>
      <div class="box">
        <div class="container-fluid">
          <div class="row">
            <div class="col-2 sidemenu"></div>
            <div class="col-10 content">
              <div class="maincontent">
                <!-- 面包屑 -->
                <nav aria-label="breadcrumb">
                  <ol class="breadcrumb">
                    <li class="breadcrumb-item" aria-current="page">
                      新闻管理
                    </li>
                    <li class="breadcrumb-item active" aria-current="page">
                      创建新闻
                    </li>
                  </ol>
                </nav>
                <!-- 表单内容 -->
                <form id="createform">
                  <div class="mb-3">
                    <label for="title" class="form-label">标题</label>
                    <input
                      type="text"
                      class="form-control"
                      id="title"
                      placeholder="请输入标题"
                      required
                    />
                  </div>
                  <div class="mb-3">
                    <label for="content" class="form-label">内容</label>
                    <div id="editor—wrapper">
                      <div id="toolbar-container"><!-- 工具栏 --></div>
                      <div id="editor-container"><!-- 编辑器 --></div>
                    </div>
                  </div>
                  <div class="mb-3">
                    <label for="category" class="form-label">类别</label>
                    <select
                      class="form-select"
                      id="category"
                      aria-label="Default select example"
                    >
                      <option value="0" selected>最新动态</option>
                      <option value="1">典型案例</option>
                      <option value="2">通知公告</option>
                    </select>
                  </div>
                  <div class="mb-3">
                    <label for="photofile" class="form-label">封面图片</label>
                    <input
                      type="file"
                      class="form-control"
                      id="photofile"
                      required
                    />
                  </div>
                  <button type="submit" class="btn btn-primary">
                    发布新闻
                  </button>
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <script src="index.js" type="module"></script>
  </body>
</html>
